import {useCallback, useEffect, useState} from "react";
import dayJs from 'dayjs';
import Taro from '@tarojs/taro';
import {Text, View} from "@tarojs/components";
import {API_URL} from "@/config";
import styles from "./index.module.scss";

interface PipelineData {
  admissionTime: string;
  dressingTime: string;
  expirationTime: string;
  installationTime: string;
  patientId: number;
  patientName: string;
  pipelineId: number;
  remark: string | null;
}

export default function (){

  const [list, setList] = useState<PipelineData[]>([]);

  const getList = useCallback(async ()=>{
    try{
      Taro.showLoading();
      const res = await Taro.request({
        url: API_URL+'/AllPipeline',
        method: 'POST',
        data:{
          pageIndex: 0,
          pageSize: 999,
        }
      });
      Taro.hideLoading();
      if(res.data.data){
        setList(res.data.data.data);
      }else{
        Taro.showToast({title:'获取失败', icon:'none', duration: 1000});
      }
    }catch (e){
      Taro.hideLoading();
    }
  },[]);

  useEffect(() => {
    getList();
  }, [getList]);

  function timeFormat(date: string){
    return dayJs(date).format('YYYY-MM-DD');
  }

  return (
    <View className={styles.cardWrapper}>
      {
        list.map(item=>(
          <View className={styles.card} key={item.patientId}>
            <View className={styles.cardHeader}>
              <Text>姓名：{item.patientName}</Text>
              <Text>床号：{item.bedId}</Text>
            </View>
            <View className={styles.cardBody}>
              <View>安装时间：{timeFormat(item.installationTime)}</View>
              <View>换药时间：{timeFormat(item.dressingTime)}</View>
              <View>到期时间：{timeFormat(item.expirationTime)}</View>
              <View>入院时间：{timeFormat(item.admissionTime)}</View>
            </View>
          </View>
        ))
      }

      {!list.length && <h6 className={styles.noData}>暂无数据</h6>}
    </View>
  );
}
